<template>
  <div class="app-container">
    <el-form :model="searchForm" :inline="true" @submit.native.prevent>
      <el-row>
        <el-col :span="19">
          <el-form-item>
            <el-input v-model="searchForm.fuzzy" style="width:300px" placeholder="任务单号/项目名称/受检单位" clearable @keyup.enter.native="handleSearch" />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" class="iconfont icon-chaxun1" @click="handleSearch"> 查询</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-table
      border
      :data="samplelinData"
      stripe
      highlight-current-row
      :header-cell-style="{background:'#ECF3FC'}"
    >
      <el-table-column type="index" width="50" label="序号" align="center" />
      <el-table-column prop="jobId" label="任务单号" align="center" />
      <el-table-column prop="projectName" label="项目名称" align="center" />
      <el-table-column prop="inspectionName" label="受检单位" align="center" />
      <el-table-column prop="checkType" label="检测类型" align="center">
        <template slot-scope="{row}">
          <span v-if="row.checkType === '0'">委托检测</span>
          <span v-if="row.checkType === '1'">样品送检</span>
        </template>
      </el-table-column>
      <el-table-column prop="sampleNumber" label="已制备样品数" align="center">
        <template slot-scope="{row}">
          <span>{{row.totalSampleItemPre}}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center">
        <template slot-scope="{row}">
          <el-button type="text" @click="lookDetail(row)">查看</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="float: right">
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="searchForm.pageNumber"
        :limit.sync="searchForm.pageSize"
        @pagination="handleSearch"/>
    </div>
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import * as samplelinServer from '@/api/samplelin'
export default {
  components: { Pagination },
  data() {
    return {
      searchForm: {
        fuzzy: '',
        pageNumber: 1,
        pageSize: 10
      },
      total: 0,
      samplelinData: []
    }
  },
  created() {
    this.handleSearch()
  },
  methods: {
    handleSearch() {
      samplelinServer.hisSampItemPreparationList(this.searchForm).then(res => {
        if (res.code === 200 && res.result) {
          this.samplelinData = res.result.records || []
          this.total = res.result.total
        }
      })
    },
    lookDetail(row) {
      this.$router.push(`/other/samplelinSampItemHis/${row.sampTaskId}`)
    }
  }
}
</script>

<style scoped lang="scss" >
.clearfix {
  line-height: 40px;
  display: flex;
}
/deep/ .el-table__header-wrapper .el-checkbox {
  display: none;
}
/deep/ .el-table__fixed-header-wrapper .el-checkbox {
  display: none;
}
.table-item /deep/ .el-table__header-wrapper .el-checkbox {   //table-item 父级类名
  display: none;
}
</style>
